<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>20220920</title>
	</head>
	<body>
		
		
		<!-- 伪类选择器
		<style>
			
			ul li{
				color: red;
			}
			
			/* 鼠标悬停应用 */
			a:hover{
				color: green;
			}
		</style>
		
		
		<ul>
			<li ><a>猫哥</a></li>
			<li >狗哥</li>
		</ul> -->
		
		
		
		<!-- 并集选择器 -->
<!-- 		<style>
			ul>li.name, ol>li{
				color: red;
			}
		</style>
		<ul >
			<li class="name">asd</li>
			<li >猫哥</li>
			<li >狗哥</li>
		</ul>
		
		<ol>
			<li >asd</li>
			<li >猫哥</li>
			<li >狗哥</li>
		</ol> -->
		
		
		
		
		<!-- 后代选择器 -->
		<!-- <style>
			
			ul.name{
				color: red;
			}
			ul .name{
				color: black;
			}
		
		</style>
		<ul class="name">
			<li class="name">asd</li>
			<li >猫哥</li>
			<li >狗哥</li>
		</ul> -->
		
		
		
		
		<!-- 子选择器 -->
		<!-- <style>
			ol>.name{
				color: gold;
			}
			 
		</style>
		
		<ol>
			<li><a href="#" class="name">asd</a></li>
			<li class="name">猫哥</li>
			<li>狗哥</li>
		</ol> -->
		
		
		
		
		<!-- <a href="#one">第一集</a>
		<a href="#two">第二集</a>
		<a href="#three">第三集</a>
		<p id="one">   第一集剧情 <br>   第一集剧情 <br>   ...</p>
		<p id="two">   第二集剧情 <br>   第二集剧情 <br> ...</p>
		<p id="three">   第三集剧情 <br>   第三集剧情 <br> ...</p>
		 -->
		
		
		
		
		
		
		<!-- <table align="" border="1" cellpadding="20" cellspacing="0" width="500" height="500">
			   <tr align="center">        
					<td>姓名</td>
					<td>性别</td>
					<td>年龄</td>
			   </tr>    
			   <tr>        
					<td>张三</td>        
					<td>男</td>        
					<td>10</td>    
			   </tr>    
			   <tr>        
				    <td>李四</td>        
				    <td>女</td>        
			 	    <td>11</td>    
			   </tr> 
		</table> -->
		
		
		
		
		
		
		
		
		
		<!-- <h3>无序列表</h3>
		<ul>    
						   <li>咬人猫</li>    
						   <li>兔总裁</li>    
						   <li>阿叶君</li>
		</ul>
		<h3>有序列表</h3>
		<ol>    
						   <li>咬人猫</li>    
						   <li>兔总裁</li>    
						   <li>阿叶君</li>
		</ol>
		<h3>自定义列表</h3>
		<dl>    
						   <dt>我的</dt>    
						   <dd>咬人猫</dd>    
						   <dd>兔总裁</dd>    
						   <dd>阿叶君</dd>
		</dl> -->
		
		
		
		
		
		
		
		
		<!-- <form action="test.html">
			  ... [form 的内容]
		</form>
		<br />
		
		<input type="text"><br />
		<input type="password"><br />
		
		
		
		
		
		
		<input type="radio" name="sex">男 
		<input type="radio" name="sex" checked="checked">女
		<br />
		
		
		
		
		
		爱好:
		<input type="checkbox"> 吃饭 
		<input type="checkbox"> 睡觉 
		<input type="checkbox"> 打游戏
		<br />
		
		
		
		
		
		
		<input type="button" value="我是个按钮">
		当前点击了没有反应. 需要搭配 JS 使用(后面会重点研究). 
		<input type="button" value="我是个按钮" onclick="alert('hello')">
		<br />
		
		
		
		
		
		
		提交按钮
		<form action="test.html">
			   <input type="text" name="username">
			   <input type="submit" value="提交">
		</form><br />
		清空按钮
		<form action="test.html">
			   <input type="text" name="username">
			   <input type="submit" value="提交">
			   <input type="reset" value="清空">
		</form><br /> -->
		
		
		
		
		
		
		
		
		
		
		<!-- <select>
			    <option>--请选择年份--</option>
			    <option>1991</option>    
				<option>1992</option>
			    <option>1993</option>
			    <option>1994</option> 
			    <option>1995</option>
		</select>-->
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		<!-- <textarea rows="3" cols="50">
		</textarea>
		<br />
		
		<div>
			<span>咬人猫</span>
			<span>咬人猫</span>
			<span>咬人猫</span>
		</div>
		<div>
			<span>兔总裁</span>
			<span>兔总裁</span>
			<span>兔总裁</span>
		</div>
		<div>
			<span>阿叶君</span>
			<span>阿叶君</span>
			<span>阿叶君</span>
		</div> -->
		
		
		<!-- <div id="sex"></div>
		<div class="sex"></div> -->
		

	</body>
</html>
